<template>
  <div class="loadHomeWork">
    <div class="loadHomeWorkIneer">
      <div class="loadTop">新增加注作业</div>
      <div class="loadAndSearch" v-show="roleId != 3">
        <div class="loadExcel">
          <!-- <div class="button" type="success" @click="uploadFile()">导入</div>
          <div class="button" type="success" @click="getExcelFile()">导出</div> -->
          <div
            class="button"
            type="success"
            @click="addOne()"
            v-if="roleId == '2'"
          >
            新增
          </div>

          <div
            class="multiButton"
            type="success"
            @click="deleteMulti()"
            v-show="roleId == 1 || roleId == 4"
          >
            删除
          </div>
          <div
            class="multiButton"
            type="success"
            @click="RoleAdeleteMulti()"
            v-show="roleId == 2"
          >
            删除
          </div>
          <div
            class="multiButton"
            type="success"
            @click="seeAllDelete()"
            v-show="roleId == 1 || roleId == 4"
            title="点击显示作业删除请求列表"
          >
            <div
              class="deleteIcon"
              style="
                display: flex;
                align-items: center;
                justify-content: center;
              "
            >
              <el-icon>
                <component :is="icon"></component>
              </el-icon>
              <div v-show="!deleteByUser" style="margin-left: 2px">
                {{ deleteNumber }}
              </div>
            </div>
          </div>
        </div>
        <!-- <div class="search">
          <input type="text" placeholder="请输入船型编号" v-model="serchNum" />
          <div class="searchButton" @click="getRenderList()">搜索</div>
        </div> -->
      </div>
      <div class="table" :style="{ width: tableWidth }">
        <el-table
          :header-cell-style="{
            background: '#FAFAFA',
            color: '#777676 !important',
            fontWeight: '800',
          }"
          :data="tableData"
          border
          empty-text="暂无数据"
          stripe
          style="width: 100%; height: auto"
          :row-style="{ height: 30 + 'px' }"
          :cell-style="{ padding: 0 + 'px' }"
          max-height="65vh"
          @selection-change="selecttableFunction"
          @row-dblclick="handleRowDblclick"
        >
          <el-table-column
            type="selection"
            width="35"
            align="center"
            :selectable="selectable"
          />

          <el-table-column
            prop="homeworkMonth"
            label="作业月份"
            align="center"
            min-width="70"
          /><el-table-column
            prop="homeworkNum"
            label="作业编号"
            align="center"
            min-width="120"
          />
          <el-table-column
            prop="preStartDate"
            label="计划作业开始时间"
            min-width="90"
            align="center"
          >
          </el-table-column>
          <el-table-column
            label="计划作业结束时间"
            min-width="90"
            prop="preEndDate"
            align="center"
          />

          <el-table-column
            prop="homeworkLocation"
            label="作业地点"
            align="center"
            min-width="90"
          />
          <el-table-column
            prop="coldCabinFlag"
            label="是否冷舱作业"
            align="center"
            min-width="90"
            :formatter="formatText"
          />
          <el-table-column
            prop="loadedShip"
            label="加注船"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="filledShip"
            label="受注船"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="preWorkload"
            label="计划作业量"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="fillingAmountHeatValue"
            label="加注量热值"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="fillingAmountVolume"
            label="加注量体积"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="weight"
            label="重量"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="fillPeople"
            label="加注专员"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="shipownerPeople"
            label="船东代表"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="reliableTime"
            label="靠妥时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="unberthingTime"
            label="离泊时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="berthingTugboatNum"
            label="靠泊拖轮数量"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="berthingTugboatName"
            label="靠泊拖轮名称"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="importEscortStartTime"
            label="进口护航开始时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="importEscortEndTime"
            label="进口护航结束时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="custodyTugboatNum"
            label="监护拖轮数量"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="custodyTugboatName"
            label="监护拖轮名称"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="custodyStartTime"
            label="监护开始时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="custodyEndTime"
            label="监护结束时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="unberthingTugboatNum"
            label="离泊拖轮数量"
            align="center"
            min-width="100"
          />

          <el-table-column
            prop="unberthingTugboatName"
            label="离泊拖轮名称"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="exportEscortStartTime"
            label="出口护航开始时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="exportEscortEndTime"
            label="出口护航结束时间"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="firstCable"
            label="第一根缆绳"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="reliable"
            label="靠泊"
            align="center"
            min-width="130"
          />

          <!-- 修改属性 -->
          <el-table-column
            prop="berthingTimeNum"
            label="靠泊用时"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="startTakingOver"
            label="开始接管"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="airtightCompletion"
            label="气密完成"
            align="center"
            min-width="130"
          />
          <!-- 修改属性 -->
          <el-table-column
            prop="takingOverTimeNum"
            label="接管气密用时"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="startCoolingTube"
            label="开始冷管"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="coolingTubeCompletion"
            label="冷管完成"
            align="center"
            min-width="130"
          />
          <!-- 修改属性 -->
          <el-table-column
            prop="coolingTubeTimeNum"
            label="冷管用时"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="stopPump"
            label="停泵"
            align="center"
            min-width="130"
          />
          <el-table-column
            prop="removeTubeCompletion"
            label="拆管完成"
            align="center"
            min-width="130"
          />
          <!-- 修改属性 -->
          <el-table-column
            prop="removeTubeTimeNum"
            label="除冰拆管用时"
            align="center"
            min-width="100"
          />
          <!-- 修改属性 -->
          <el-table-column
            prop="homeworkDurationTimeNum"
            label="实际作业时长"
            align="center"
            min-width="100"
          />
          <!-- 修改属性 -->
          <el-table-column
            prop="importEscortTimeNum"
            label="进口护航时长"
            align="center"
            min-width="100"
          />
          <!-- 修改属性 -->
          <el-table-column
            prop="custodyTimeNum"
            label="监护时长"
            align="center"
            min-width="100"
          />
          <!-- 修改属性 -->
          <el-table-column
            prop="exportEscortTimeNum"
            label="出口护航时长"
            align="center"
            min-width="100"
          />
          <el-table-column
            prop="includeFlag"
            label="是否计入图表"
            align="center"
            min-width="100"
          />
        </el-table>
        <!-- 内容过多，会出现滚动条 -->
      </div>
      <div class="foot">
        <div class="currentPage">当前第{{ page }}/{{ totalPages }}页</div>
        <div
          class="lastPage"
          :style="{ background: color }"
          @click="clickLastPage()"
        >
          上一页
        </div>
        <div
          class="nextPage"
          :style="{ backgroundColor: color1 }"
          @click="clickNextPage()"
        >
          下一页
        </div>
        <div class="currentNumber">共{{ totalNumber }}条</div>
        <div>跳转至:</div>
        <input
          type="text"
          class="skipPage"
          style="width: 50px !important"
          v-model="shipPageNumer"
        />
        <div class="sureSkip" @click="skipPage">确定</div>
      </div>
    </div>
    <div class="dialog" ref="dialog" :style="{ display: show }">
      <div class="loadHomeWorkIneer">
        <div class="changeTop">
          <div
            class="delete"
            @click="deleteOne(id)"
            v-show="
              (this.roleId == 1 || this.roleId == 4) &&
              this.addOrEdit != '删除审核'
            "
          >
            删除
          </div>
          <div
            class="delete"
            @click="RoleAdeleteOne()"
            v-show="
              this.roleId == 2 && this.addOrEdit != '新增' && this.state != 'C'
            "
          >
            删除
          </div>
          <!-- 管理员A的确认 -->
          <div
            class="sure"
            @click="sureAdd()"
            v-show="
              (this.roleId == 2 && this.state == 'B') ||
              (this.roleId == 2 && !this.state)
            "
          >
            确认
          </div>
          <!-- 管理员B的确认 -->
          <div
            class="sure"
            @click="sureAdd()"
            v-show="this.roleId == 3 && this.state == 'A1'"
          >
            确认
          </div>
          <!-- 管理员C的确认 -->
          <div
            class="sure"
            @click="sureAdd()"
            v-show="
              (this.roleId == 1 &&
                this.state == 'A1' &&
                this.addOrEdit == '删除审核') ||
              (this.roleId == 4 &&
                this.state == 'A1' &&
                this.addOrEdit == '删除审核') ||
              (this.roleId == 1 &&
                this.state == 'B' &&
                this.addOrEdit == '删除审核') ||
              (this.roleId == 4 &&
                this.state == 'B' &&
                this.addOrEdit == '删除审核') ||
              (this.roleId == 4 &&
                this.state == 'A2' &&
                this.addOrEdit == '删除审核') ||
              (this.roleId == 1 &&
                this.state == 'A2' &&
                this.addOrEdit == '删除审核') ||
              (this.roleId == 1 &&
                this.state == 'A2' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 4 &&
                this.state == 'A2' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 1 &&
                this.state == 'C' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 4 &&
                this.state == 'C' &&
                this.addOrEdit == '编辑')
            "
          >
            确认
          </div>

          <div class="back" @click="backToIndex()">返回</div>
        </div>
        <div class="dialogText">{{ addOrEdit }}</div>
        <div class="manyInput">
          <div class="iuptInnerContain1">
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">作业月份:</div>
              <el-select
                class="mySelect"
                v-model="homeworkMonth"
                :no-data-text="'无数据'"
                placeholder="作业月份"
                size="default"
                style="margin-left: 5px; width: 200px"
                :disabled="disabledA"
              >
                <el-option v-for="item in 12" :label="item" :value="item" />
              </el-select>
            </div>
            <div class="inputInner">
              <div class="name">作业编号:</div>
              <el-input
                type="text"
                name=""
                placeholder="作业编号"
                v-model="homeworkNum"
                style="margin-left: 5px; width: 200px"
                :disabled="disabledA"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">计划作业开始时间:</div>

              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="preStartDate"
                  type="date"
                  placeholder="计划作业开始时间"
                  format="YYYY/MM/DD"
                  value-format="YYYY/MM/DD"
                  :disabled="disabledA"
                  style="margin-left: 5px; width: 200px"
                  @change="caculateTimeS(preStartDate, preEndDate)"
                />
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">计划作业结束时间:</div>

              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="preEndDate"
                  type="date"
                  placeholder="计划作业结束时间"
                  format="YYYY/MM/DD"
                  value-format="YYYY/MM/DD"
                  style="margin-left: 5px; width: 200px"
                  :disabled="disabledA"
                  @change="caculateTimeS(preStartDate, preEndDate)"
                />
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">作业地点:</div>
              <!-- <el-input
                style="margin-left: 5px; width: 200px"
                type="text"
                name=""
                placeholder="作业团队"
                v-model="homeworkLocation"
                :disabled="disabledA"
              /> -->
              <el-select
                style="width: 200px; margin-left: 5px"
                v-model="homeworkLocation"
                :no-data-text="'无数据'"
                placeholder="请选择"
                :disabled="disabledA"
              >
                <el-option
                  v-for="item in placeList"
                  :label="item.name"
                  :value="item.value"
                ></el-option>
              </el-select>
            </div>
            <div class="inputInner">
              <div class="name">是否冷舱作业:</div>
              <el-select
                class="mySelect"
                :no-data-text="'无数据'"
                v-model="coldCabinFlag"
                placeholder="是否冷舱作业"
                size="default"
                style="margin-left: 5px; width: 200px"
                :disabled="disabledA"
              >
                <el-option label="是" value="true" />
                <el-option label="否" value="false" />
              </el-select>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">加注船:</div>
              <el-input
                style="margin-left: 5px; width: 200px"
                type="text"
                name=""
                placeholder="加注船"
                v-model="loadedShip"
                :disabled="disabledA"
              />
            </div>

            <div class="inputInner">
              <div class="name">受注船:</div>
              <el-input
                style="margin-left: 5px; width: 200px"
                type="text"
                name=""
                placeholder="受注船"
                v-model="filledShip"
                :disabled="disabledA"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">计划作业量:</div>
              <el-input
                type="number"
                style="margin-left: 5px; width: 200px"
                name=""
                placeholder="计划作业量"
                :disabled="disabledA"
                v-model="preWorkload"
              />
            </div>
          </div>
          <div class="spliceLine"></div>
          <div class="iuptInnerContain1">
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">加注量热值:</div>
              <el-input
                type="number"
                :disabled="disabledB"
                placeholder="加注量热值"
                v-model="fillingAmountHeatValue"
                style="margin-left: 5px; width: 200px"
              />
            </div>
            <div class="inputInner">
              <div class="name">加注量体积:</div>
              <el-input
                type="number"
                name=""
                placeholder="加注量体积"
                v-model="fillingAmountVolume"
                style="width: 200px; margin-left: 5px"
                :disabled="disabledB"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">重量:</div>
              <el-input
                type="number"
                name=""
                placeholder="重量"
                v-model="weight"
                style="width: 200px; margin-left: 5px"
                :disabled="disabledB"
              />
            </div>
            <div class="inputInner">
              <div class="name">加注专员:</div>
              <el-input
                type="text"
                name=""
                placeholder="加注专员"
                style="width: 200px; margin-left: 5px"
                :disabled="disabledB"
                v-model="fillPeople"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">船东代表:</div>
              <el-input
                type="text"
                name=""
                placeholder="船东代表"
                style="width: 200px; margin-left: 5px"
                :disabled="disabledB"
                v-model="shipownerPeople"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">靠妥时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="reliableTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                  :disabled="disabledB"
                  @change="caculateTime(reliableTime, unberthingTime, 5)"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">离泊时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="unberthingTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                  :disabled="disabledB"
                  @change="caculateTime(reliableTime, unberthingTime, 5)"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
          </div>

          <div class="iuptInnerContain1">
            <div class="inputInner">
              <div class="name">靠泊拖轮数量:</div>
              <el-input
                type="number"
                style="width: 200px; margin-left: 5px"
                name=""
                placeholder="靠泊拖轮数量"
                v-model="berthingTugboatNum"
                :disabled="disabledB"
              />
            </div>
            <div class="inputInner">
              <div class="name">靠泊拖轮名称:</div>
              <el-input
                type="text"
                name=""
                style="width: 200px; margin-left: 5px"
                placeholder="靠泊拖轮名称"
                :disabled="disabledB"
                v-model="berthingTugboatName"
              />
            </div>
            <div class="inputInner">
              <div class="name">进口护航开始时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  @change="
                    caculateTime(importEscortStartTime, importEscortEndTime, 6)
                  "
                  v-model="importEscortStartTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  :disabled="disabledB"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">进口护航结束时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  @change="
                    caculateTime(importEscortStartTime, importEscortEndTime, 6)
                  "
                  v-model="importEscortEndTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  :disabled="disabledB"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">监护拖轮数量:</div>
              <el-input
                type="number"
                name=""
                placeholder="监护拖轮数量"
                v-model="custodyTugboatNum"
                style="width: 200px; margin-left: 5px"
                :disabled="disabledB"
              />
            </div>
            <div class="inputInner">
              <div class="name">监护拖轮名称:</div>
              <el-input
                type="text"
                name=""
                placeholder="监护拖轮名称"
                style="width: 200px; margin-left: 5px"
                v-model="custodyTugboatName"
                :disabled="disabledB"
              />
            </div>
            <div class="inputInner">
              <div class="name">监护开始时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="custodyStartTime"
                  @change="caculateTime(custodyStartTime, custodyEndTime, 7)"
                  type="datetime"
                  :disabled="disabledB"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">监护结束时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="custodyEndTime"
                  @change="caculateTime(custodyStartTime, custodyEndTime, 7)"
                  type="datetime"
                  :disabled="disabledB"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">离泊拖轮数量:</div>
              <el-input
                type="number"
                style="width: 200px; margin-left: 5px"
                :disabled="disabledB"
                name=""
                placeholder="离泊拖轮数量"
                v-model="unberthingTugboatNum"
              />
            </div>
            <div class="inputInner">
              <div class="name">离泊拖轮名称:</div>
              <el-input
                type="text"
                style="width: 200px; margin-left: 5px"
                name=""
                placeholder="离泊拖轮名称"
                :disabled="disabledB"
                v-model="unberthingTugboatName"
              />
            </div>
            <div class="inputInner">
              <div class="name">出口护航开始时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  @change="
                    caculateTime(exportEscortStartTime, exportEscortEndTime, 8)
                  "
                  v-model="exportEscortStartTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  :disabled="disabledB"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">出口护航结束时间:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="exportEscortEndTime"
                  @change="
                    caculateTime(exportEscortStartTime, exportEscortEndTime, 8)
                  "
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                  :disabled="disabledB"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
          </div>

          <div class="iuptInnerContain1">
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">第一根缆绳:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="firstCable"
                  @change="caculateTime(firstCable, reliable, 1)"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                  :disabled="disabledB"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">靠妥:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="reliable"
                  @change="caculateTime(firstCable, reliable, 1)"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  :disabled="disabledB"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">靠泊用时:</div>
              <el-input
                type="number"
                disabled
                style="width: 200px; margin-left: 5px"
                placeholder="靠泊用时(分钟)"
                v-model="berthingTimeNum"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">开始接管:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="startTakingOver"
                  @change="caculateTime(startTakingOver, airtightCompletion, 2)"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  :disabled="disabledB"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">气密完成:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="airtightCompletion"
                  @change="caculateTime(startTakingOver, airtightCompletion, 2)"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                  :disabled="disabledB"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">接管气密用时:</div>
              <el-input
                type="number"
                class="disabled"
                disabled
                name=""
                placeholder="接管气密用时(分钟)"
                style="width: 200px; margin-left: 5px"
                v-model="takingOverTimeNum"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">开始冷管:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  @change="
                    caculateTime(startCoolingTube, coolingTubeCompletion, 3)
                  "
                  v-model="startCoolingTube"
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                  :disabled="disabledB"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">冷管完成:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="coolingTubeCompletion"
                  @change="
                    caculateTime(startCoolingTube, coolingTubeCompletion, 3)
                  "
                  type="datetime"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  :disabled="disabledB"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">冷管用时:</div>
              <el-input
                type="number"
                name=""
                class="disabled"
                style="width: 200px; margin-left: 5px"
                disabled
                placeholder="冷管用时(分钟)"
                v-model="coolingTubeTimeNum"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">停泵:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  v-model="stopPump"
                  type="datetime"
                  @change="caculateTime(stopPump, removeTubeCompletion, 4)"
                  placeholder="选择日期时间"
                  format="YYYY/MM/DD HH:mm"
                  :disabled="disabledB"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">拆管完成:</div>
              <el-config-provider :locale="locale">
                <el-date-picker
                  @change="caculateTime(stopPump, removeTubeCompletion, 4)"
                  v-model="removeTubeCompletion"
                  type="datetime"
                  placeholder="选择日期时间"
                  :disabled="disabledB"
                  format="YYYY/MM/DD HH:mm"
                  style="width: 200px; margin-left: 5px"
                >
                </el-date-picker>
              </el-config-provider>
            </div>
            <div class="inputInner">
              <div class="name">除冰拆管用时:</div>
              <el-input
                type="number"
                name=""
                placeholder="除冰拆管用时"
                style="width: 200px; margin-left: 5px"
                v-model="removeTubeTimeNum"
                disabled
              />
            </div>
          </div>
          <div class="iuptInnerContain1">
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">实际作业时长:</div>
              <el-input
                type="number"
                name=""
                style="width: 200px; margin-left: 5px"
                disabled
                placeholder="实际作业时长(分钟)"
                v-model="homeworkDurationTimeNum"
              />
            </div>
            <div class="inputInner">
              <div class="name">进口护航时长:</div>
              <el-input
                type="number"
                name=""
                style="width: 200px; margin-left: 5px"
                disabled
                placeholder="进口护航时长(分钟)"
                v-model="importEscortTimeNum"
              />
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">监护时长:</div>
              <el-input
                type="number"
                name=""
                style="width: 200px; margin-left: 5px"
                disabled
                placeholder="监护时长(分钟)"
                v-model="custodyTimeNum"
              />
            </div>
            <div class="inputInner">
              <div class="name">出口护航时长:</div>
              <el-input
                type="number"
                name=""
                style="width: 200px; margin-left: 5px"
                disabled
                placeholder="出口护航时长(分钟)"
                v-model="exportEscortTimeNum"
              />
            </div>
          </div>
          <div class="spliceLine"></div>
          <div class="iuptInnerContain1">
            <div class="inputInner">
              <div class="name"></div>
              <div style="width: 200px; margin-left: 5px"></div>
            </div>
            <div class="inputInner">
              <div class="name">是否计入图表:</div>
              <el-input
                type="text"
                oninput="value=value.replace(/[^0|1]/g,'').slice(0,1)"
                :disabled="disabled1"
                placeholder="是否计入图表(1:是;0:否)"
                v-model="includeFlag"
                style="width: 200px; margin-left: 5px"
              />
            </div>
          </div>
          <div
            class="spliceLine"
            v-show="
              (this.roleId == 1 &&
                this.state == 'A2' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 4 &&
                this.state == 'A2' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 4 &&
                this.state == 'C' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 1 &&
                this.state == 'C' &&
                this.addOrEdit == '编辑')
            "
          ></div>
          <div
            class="iuptInnerContain"
            v-show="
              (this.roleId == 1 &&
                this.state == 'A2' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 4 &&
                this.state == 'A2' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 4 &&
                this.state == 'C' &&
                this.addOrEdit == '编辑') ||
              (this.roleId == 1 &&
                this.state == 'C' &&
                this.addOrEdit == '编辑')
            "
            style="width: 100%; display: flex"
          >
            <div
              class="inputInner"
              style="
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
              "
            >
              <div class="name" style="color: #365488; font-size: 15px">
                审核结果：
              </div>

              <el-radio-group v-model="radio1">
                <el-radio value="1" size="large">同意</el-radio>
                <el-radio value="2" size="large">退回</el-radio>
              </el-radio-group>
              <!-- </div> -->
            </div>
            <div
              style="height: 35px; margin-bottom: 20px; width: 100%"
              v-show="!radio1 || radio1 == '1'"
            ></div>
            <div
              style="width: 780px; height: 90px; margin: auto"
              v-show="radio1 == 2"
            >
              <el-input
                v-model="textarea1"
                style="width: 100%; height: 100%"
                type="textarea"
                placeholder="退回原因"
              />
            </div>
          </div>
          <div
            class="spliceLine"
            v-show="
              (this.roleId == 1 && this.addOrEdit == '删除审核') ||
              (this.roleId == 4 && this.addOrEdit == '删除审核') ||
              (this.roleId == 4 && this.addOrEdit == '删除审核') ||
              (this.roleId == 1 && this.addOrEdit == '删除审核')
            "
          ></div>
          <div
            class="iuptInnerContain"
            v-show="
              (this.roleId == 1 && this.addOrEdit == '删除审核') ||
              (this.roleId == 4 && this.addOrEdit == '删除审核') ||
              (this.roleId == 4 && this.addOrEdit == '删除审核') ||
              (this.roleId == 1 && this.addOrEdit == '删除审核')
            "
            style="width: 100%; display: flex"
          >
            <div
              style="
                width: 780px;
                height: 52px;
                margin: auto;
                display: flex;
                align-items: center;
                margin-top: 10px;
              "
              v-show="
                (this.roleId == 1 && this.addOrEdit == '删除审核') ||
                (this.roleId == 4 && this.addOrEdit == '删除审核') ||
                (this.roleId == 4 && this.addOrEdit == '删除审核') ||
                (this.roleId == 1 && this.addOrEdit == '删除审核')
              "
            >
              <div
                class="name1"
                style="color: #365488; font-size: 15px; width: 70px"
              >
                删除原因:
              </div>
              <el-input
                v-model="textarea2"
                style="width: 710px; height: 100%"
                disabled
                type="textarea"
                placeholder="退回原因"
              />
            </div>
            <div
              class="inputInner"
              style="
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
              "
            >
              <div class="name" style="color: #365488; font-size: 15px">
                审核结果：
              </div>

              <el-radio-group v-model="radio2">
                <el-radio value="1" size="large">同意</el-radio>
                <el-radio value="2" size="large">不同意</el-radio>
              </el-radio-group>
              <!-- </div> -->
            </div>

            <!-- <div
              style="width: 780px; height: 90px; margin: auto"
              v-show="
                (this.roleId == 1 && this.addOrEdit == '删除审核') ||
                (this.roleId == 4 && this.addOrEdit == '删除审核') ||
                (this.roleId == 4 && this.addOrEdit == '删除审核') ||
                (this.roleId == 1 && this.addOrEdit == '删除审核')
              "
            >
              <el-input
                v-model="textarea2"
                style="width: 100%; height: 100%"
                type="textarea"
                placeholder="退回原因"
              />
            </div> -->
            <!-- 审核退回原因 -->
            <div
              class="iuptInnerContain"
              v-show="
                notPassMessage && (roleId == 2 || roleId == 3) && state != 'C'
              "
              style="width: 100%; display: flex"
            >
              <div
                class="inputInner"
                style="
                  width: 100%;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                "
              >
                <div class="name" style="color: #365488; font-size: 15px">
                  审核退回原因：
                </div>
                <!-- </div> -->
              </div>
              <el-input
                :value="notPassMessage"
                disabled
                style="
                  width: 50%;
                  height: 30px;
                  margin: auto;
                  margin-bottom: 20px;
                "
                type="textarea"
                placeholder="退回原因"
              />
              <div style="width: 100%; height: 20px"></div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="dialog2" :style="{ display: uploadfile }">
      <div class="upContain">
        <input
          type="file"
          ref="clearFile"
          class="addfile"
          @change="getFile($event)"
          accept=".xls,.xlsx"
        />
      </div>
      <div class="fileName">
        <div v-show="fileName">文件名:{{ fileName }}</div>
      </div>
      <div class="upFileSrue">
        <button class="buttonUpdata" @E="cancelUp()">取消</button>
        <button class="buttonUpdata buttonUpdata1" @click="submitAddFile()">
          确定
        </button>
      </div>
    </div>
    <div class="dialogDelete" :style="{ display: show3 }">
      <div class="titleDelete">请说明删除原因</div>
      <div class="closedialogDelete" @click="closedialogDelete">X</div>
      <div class="messageBox">
        <el-input
          v-model="message"
          style="width: 100%"
          :autosize="{ minRows: 4, maxRows: 4 }"
          type="textarea"
          placeholder="删除原因"
        />
      </div>
      <div class="sure" @click="deleteSure()">确定</div>
    </div>
    <div class="dialogDelete" :style="{ display: show4 }">
      <div class="titleDelete">请说明删除原因</div>
      <div class="closedialogDelete" @click="closedialogDelete">X</div>
      <div class="messageBox">
        <el-input
          v-model="message"
          style="width: 100%"
          :autosize="{ minRows: 4, maxRows: 4 }"
          type="textarea"
          placeholder="删除原因"
        />
      </div>
      <div class="sure" @click="RoleAdeleteMultiSure()">确定</div>
    </div>
  </div>
</template>

<script>
import EventBus from "@/mitt/eventBus.js";
import rename from "@/mitt/getPath.js";
import service from "@/api/api";
import _ from "lodash";
import zhCn from "element-plus/es/locale/lang/zh-cn";
import axios from "axios";
export default {
  name: "",
  data() {
    return {
      compare: {},
      notPassMessage: null,
      show4: "none",
      message: "",
      deleteNumber: null,
      disabledA: false,
      disabledB: false,
      disabled1: false,
      state: "",
      placeList: [],
      textarea1: null,
      radio1: null,
      serchNum: null,
      shipPageNumer: 1,
      multi: [],
      locale: zhCn,
      totalNumber: 0,
      tableData: [],
      tableWidth: null,
      page: 1,
      size: 20,
      show: "none",
      addOrEdit: "新增",
      currentNum: 0,
      roleId: null,
      totalPages: null,
      uploadfile: true,
      data: {
        homeworkMonth: "",
        preStartDate: "",
        homeworkNum: "",
        preEndDate: "",
        homeworkLocation: "",
        loadedShip: "",
        filledShip: "",
        preWorkload: "",
        fillingAmountHeatValue: "",
        fillingAmountVolume: "",
        weight: "",
        fillPeople: "",
        shipownerPeople: "",
        reliableTime: "",
        unberthingTime: "",
        berthingTugboatNum: "",
        berthingTugboatName: "",
        importEscortStartTime: "",
        importEscortEndTime: "",
        custodyTugboatNum: "",
        custodyTugboatName: "",
        custodyStartTime: "",
        custodyEndTime: "",
        unberthingTugboatNum: "",
        unberthingTugboatName: "",
        exportEscortStartTime: "",
        exportEscortEndTime: "",
        firstCable: "",
        reliable: "",

        berthingTimeNum: "",
        startTakingOver: "",
        airtightCompletion: "",
        takingOverTimeNum: "",
        startCoolingTube: "",
        coolingTubeCompletion: "",
        coolingTubeTimeNum: "",
        stopPump: "",
        removeTubeCompletion: "",
        includeFlag: "",
        removeTubeTimeNum: "",
        homeworkDurationTimeNum: "",
        importEscortTimeNum: "",
        custodyTimeNum: "",
        exportEscortTimeNum: "",
        includeFlag: "",
        coldCabinFlag: "",
        id: "",
      },
      homeworkMonth: "",
      preStartDate: "",
      homeworkNum: "",
      preEndDate: "",
      homeworkLocation: "",

      loadedShip: "",
      filledShip: "",
      preWorkload: "",

      fillingAmountHeatValue: "",
      fillingAmountVolume: "",
      weight: "",
      fillPeople: "",
      shipownerPeople: "",
      reliableTime: "",
      reliable: "",
      unberthingTime: "",
      berthingTugboatNum: "",
      berthingTugboatName: "",
      importEscortStartTime: "",
      importEscortEndTime: "",
      custodyTugboatNum: "",
      custodyTugboatName: "",
      custodyStartTime: "",
      custodyEndTime: "",
      unberthingTugboatNum: "",
      unberthingTugboatName: "",
      exportEscortStartTime: "",
      exportEscortEndTime: "",
      firstCable: "",
      berthing: "",
      berthingTimeNum: "",
      startTakingOver: "",
      airtightCompletion: "",
      takingOverTimeNum: "",
      startCoolingTube: "",
      coolingTubeCompletion: "",
      coolingTubeTimeNum: "",
      stopPump: "",
      removeTubeCompletion: "",
      includeFlag: "",
      removeTubeTimeNum: "",
      homeworkDurationTimeNum: "",
      importEscortTimeNum: "",
      custodyTimeNum: "",
      exportEscortTimeNum: "",
      coldCabinFlag: "",
      id: "",
      show1: "none",
      color: "#EBEBEB",
      color1: "#EBEBEB",
      file: null,
      fileName: "",
      jtData: null,
      token: "",
      show3: "none",
      deleteByUser: null,
      showDeleteFlag: "",
      textarea2: "",
      radio2: null,
      icon: "DeleteFilled",
    };
  },
  props: [],
  components: {},
  computed: {},
  filters: {},

  methods: {
    closedialogDelete() {
      this.show3 = "none";
      this.show4 = "none";
      return this.$message({
        message: "删除操作中止",
        type: "info",
      });
    },
    // 查看所有删除
    seeAllDelete() {
      this.deleteByUser = true;

      if (this.icon == "DeleteFilled") {
        this.deleteByUser = true;
        this.addOrEdit = "删除审核";
        this.icon = "Memo";
        this.page = 1;
        this.size = 20;
      } else if (this.icon == "Memo") {
        this.icon = "DeleteFilled";
        this.deleteByUser = null;
        this.addOrEdit = "";
      }
      this.getRenderList();
    },

    // 管理员A单个删除数据
    RoleAdeleteOne() {
      this.show3 = "block";
    },
    // 管理员A单个删除数据
    deleteSure() {
      // let that = this;

      if (!this.message) {
        return this.$message({
          message: "删除原因必须填写",
          type: "warning",
        });
      } else {
        this.show3 = "none";
      }
      this.$alert("确定删除这条信息？", {
        confirmButtonText: "确定",
        callback: (action) => {
          if (action == "confirm") {
            service({
              method: "delete",
              url: `/add-homework/${this.id}`,
              data: {
                message: this.message,
              },
            })
              .then((r) => {
                if (r.status == "SUCCESS") {
                  this.$message({
                    type: "success",
                    message: "删除提交审核成功",
                  });
                  this.getRenderList();
                  this.show = "none";
                } else if (r.status == "ERROR") {
                  this.$message({
                    type: "success",
                    message: r.error,
                  });
                  this.getRenderList();
                  this.show = "none";
                }
                this.message = "";
              })
              .catch((err) => {
                this.$message({
                  type: "danger",
                  message: "出错了！",
                });
              });
          } else {
            this.$message({
              type: "info",
              message: "取消删除",
            });
            this.message = "";
          }
        },
      });
    },
    RoleAdeleteMulti() {
      if (this.multi.length == 0) {
        return this.$message({
          type: "warning",
          message: "请先选中再进行批量删除操作！",
        });
      } else {
        this.show4 = "block";
      }
    },
    async findAllType() {
      await service({
        methods: "get",
        url: "/dict-type/find-all",
      })
        .then((e) => {
          for (let i = 0; i < e.data.length; i++) {
            if (e.data[i].name == "作业地点") {
              this.getPlace(e.data[i].typeKey);
            }
          }
          this.getRenderList();
        })
        .catch((err) => {});
    },
    async getPlace(type) {
      let data = {
        typeKey: type,
      };

      await service({
        methods: "get",
        url: "dict-type/find-dict-item-list",
        params: data,
      })
        .then((e) => {
          this.placeList = e.data;
        })
        .catch((err) => {
          this.$message({
            message: "获取数据失败",
            type: "info",
          });
        });
    },
    // 管理员A批量删除数据
    RoleAdeleteMultiSure() {
      if (!this.message) {
        return this.$message({
          message: "删除原因必须填写",
          type: "warning",
        });
      } else {
        this.show4 = "none";
      }
      let data = {
        idList: this.multi + "",
        message: this.message,
      };

      this.$alert("确定删除选中的信息？", {
        confirmButtonText: "确定",
        callback: (action) => {
          if (action == "confirm") {
            service({
              method: "delete",
              url: `/add-homework`,
              params: data,
            }).then((r) => {
              if (r.status == "SUCCESS") {
                this.$message({
                  type: "success",
                  message: "删除提交审核成功",
                });
                this.message = "";
                this.getRenderList();
              }
            });
          } else {
            this.$message({
              type: "info",
              message: "取消删除",
            });
            this.message = "";
          }
        },
      });
    },
    clickDelete() {
      this.addOrEdit = "删除审核";
    },
    caculateTimeS(a, b) {
      if (a && b) {
        let time1 = new Date(a).getTime();
        let time2 = new Date(b).getTime();
        let actualTime = (time2 - time1) / 1000;
        if (actualTime < 0) {
          this.preEndDate = "";
          return this.$message({
            message: "结束时间不能早于开始时间，已重置结束时间",
            type: "warning",
          });
        }
      }
    },
    caculateTime(a, b, c) {
      let actualTime;
      if (a && b) {
        let time1 = new Date(a).getTime();
        let time2 = new Date(b).getTime();
        actualTime = (time2 - time1) / 1000;

        if (c == 6) {
          if (actualTime < 0) {
            this.importEscortEndTime = "";
            this.importEscortTimeNum = null;
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          }
          this.importEscortTimeNum = Math.round(actualTime / 60);
        } else if (c == 7) {
          if (actualTime < 0) {
            this.custodyEndTime = "";
            this.custodyTimeNum = null;
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          } else {
            this.custodyTimeNum = Math.round(actualTime / 60);
          }
        } else if (c == 8) {
          if (actualTime < 0) {
            this.exportEscortEndTime = "";
            this.exportEscortTimeNum = null;
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          } else {
            this.exportEscortTimeNum = Math.round(actualTime / 60);
          }
        } else if (c == 2) {
          if (actualTime < 0) {
            this.airtightCompletion = "";
            this.takingOverTimeNum = null;
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          } else {
            this.takingOverTimeNum = Math.round(actualTime / 60);
          }
        } else if (c == 3) {
          if (actualTime < 0) {
            this.coolingTubeCompletion = "";
            this.coolingTubeTimeNum = null;
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          } else {
            this.coolingTubeTimeNum = Math.round(actualTime / 60);
          }
        } else if (c == 1) {
          if (actualTime < 0) {
            this.reliable = "";
            this.berthingTimeNum = null;
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          } else {
            this.berthingTimeNum = Math.round(actualTime / 60);
          }
        } else if (c == 4) {
          if (actualTime < 0) {
            this.removeTubeCompletion = "";
            this.removeTubeTimeNum = null;
            // this.homeworkDurationTimeNum = "";
            // this.removeTubeTimeNum = "";
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          } else {
            this.removeTubeTimeNum = Math.round(actualTime / 60);
          }
        } else if (c == 5) {
          if (actualTime < 0) {
            this.unberthingTime = "";
            this.homeworkDurationTimeNum = "";
            return this.$message({
              message: "时间输入有误,已重置后项时间，请检查!",
              type: "warning",
            });
          } else {
            this.homeworkDurationTimeNum = Math.round(actualTime / 60);
          }
        }
      }
    },
    handleRowDblclick(row) {
      this.clickEdit(row.id);
    },
    // 跳转页面
    skipPage() {
      if (this.shipPageNumer <= this.totalPages && this.shipPageNumer > 0) {
        this.page = this.shipPageNumer;
        this.getRenderList();
      } else {
        this.$message({
          type: "warning",
          message: "超出页面数量范围",
        });
      }
    },
    selectable(row) {
      if (this.roleId == 2 && row.state == "C") {
        return false;
      } else {
        return true;
      }
    },
    selecttableFunction(row) {
      if (row.length > 0) {
        this.multi = [];
        row.forEach((element) => {
          this.multi.push(element.id);
        });
      } else {
        this.multi = [];
      }
    },
    deleteMulti() {
      if (this.multi.length == 0) {
        return this.$message({
          type: "warning",
          message: "请先选中再进行批量删除操作！",
        });
      }
      let data = {
        idList: this.multi + "",
      };

      this.$alert("确定删除选中的信息？", {
        confirmButtonText: "确定",
        callback: (action) => {
          if (action == "confirm") {
            service({
              method: "delete",
              url: `/add-homework`,
              params: data,
            }).then((r) => {
              if (r.status == "SUCCESS") {
                this.$message({
                  type: "success",
                  message: "删除成功",
                });
                if (this.currentNum == this.multi.length && this.page > 1) {
                  this.page--;
                }
                this.getRenderList();
              }
            });
          } else {
            this.$message({
              type: "info",
              message: "取消删除",
            });
          }
        },
      });
    },
    //批量删除结束=============================

    // 导入文件================
    uploadFile() {
      this.uploadfile = "block";
    },
    getFile(event) {
      this.file = event.target.files[0];
      this.fileName = this.file.name;
    },

    submitAddFile() {
      if (this.file) {
        let data = {
          file: this.file,
        };
        service({
          method: "post",
          url: "/add-homework/upload",
          headers: {
            "Content-Type": "multipart/form-data",
          },
          data: data,
        })
          .then((res) => {
            document.getElementsByClassName("addfile")[0].value = "";
            this.$message({
              message: "上传成功",
              type: "success",
            });
            this.file = "";
            this.fileName = "";
            this.uploadfile = "none";
            this.getRenderList();
          })
          .catch((err) => {
            this.$message({
              message: err,
              type: "fail",
            });
          });
      } else {
        this.$message({
          message: "请先选择文件再上传",
          type: "warning",
        });
      }
    },
    cancelUp() {
      this.file = "";
      this.fileName = "";
      this.uploadfile = "none";
    },
    // 导入文件结束=============
    backToIndex() {
      if (this.addOrEdit == "编辑") {
        let data = {
          homeworkMonth: this.homeworkMonth,
          preStartDate: this.preStartDate,
          homeworkNum: this.homeworkNum,
          preEndDate: this.preEndDate,
          homeworkLocation: this.homeworkLocation,
          loadedShip: this.loadedShip,
          filledShip: this.filledShip,
          preWorkload: this.preWorkload,
          fillingAmountHeatValue: this.fillingAmountHeatValue,
          fillingAmountVolume: this.fillingAmountVolume,
          weight: this.weight,
          fillPeople: this.fillPeople,
          shipownerPeople: this.shipownerPeople,
          unberthingTime: this.unberthingTime,
          berthingTugboatNum: this.berthingTugboatNum,
          berthingTugboatName: this.berthingTugboatName,
          importEscortStartTime: this.importEscortStartTime,
          importEscortEndTime: this.importEscortEndTime,
          custodyTugboatNum: this.custodyTugboatNum,
          custodyTugboatName: this.custodyTugboatName,
          custodyStartTime: this.custodyStartTime,
          custodyEndTime: this.custodyEndTime,
          unberthingTugboatNum: this.unberthingTugboatNum,
          unberthingTugboatName: this.unberthingTugboatName,
          exportEscortStartTime: this.exportEscortStartTime,
          exportEscortEndTime: this.exportEscortEndTime,
          firstCable: this.firstCable,
          berthingTimeNum: this.berthingTimeNum,
          startTakingOver: this.startTakingOver,
          airtightCompletion: this.airtightCompletion,
          takingOverTimeNum: this.takingOverTimeNum,
          startCoolingTube: this.startCoolingTube,
          coolingTubeCompletion: this.coolingTubeCompletion,
          coolingTubeTimeNum: this.coolingTubeTimeNum,
          stopPump: this.stopPump,
          removeTubeCompletion: this.removeTubeCompletion,
          includeFlag: this.includeFlag,
          removeTubeTimeNum: this.removeTubeTimeNum,
          homeworkDurationTimeNum: this.homeworkDurationTimeNum,
          importEscortTimeNum: this.importEscortTimeNum,
          custodyTimeNum: this.custodyTimeNum,
          exportEscortTimeNum: this.exportEscortTimeNum,
          includeFlag: this.includeFlag,
          state: this.state,
          reliableTime: this.reliableTime,
          reliable: this.reliable,
        };
        let equal = _.isEqual(data, JSON.parse(this.compare));

        if (equal) {
          this.close();
        } else {
          this.$confirm("数据信息有变化是否保存再离开？", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            // type: "warning",
          })
            .then(() => {
              this.sureAdd();
            })
            .catch(() => {
              this.close();
            });
        }
      } else if (this.addOrEdit == "新增") {
        this.close();
      }
    },
    clickEdit(a) {
      if (
        this.addOrEdit == "删除审核" &&
        (this.roleId == 1 || this.roleId == 4)
      ) {
      } else {
        this.addOrEdit = "编辑";
      }

      this.tableData.forEach((item) => {
        if (item.id == a) {
          this.homeworkMonth = item.homeworkMonth;
          this.preStartDate = item.preStartDate;
          this.homeworkNum = item.homeworkNum;
          this.preEndDate = item.preEndDate;
          this.homeworkLocation = item.homeworkLocation;
          this.loadedShip = item.loadedShip;
          this.filledShip = item.filledShip;
          this.preWorkload = item.preWorkload;
          this.fillingAmountHeatValue = item.fillingAmountHeatValue;
          this.fillingAmountVolume = item.fillingAmountVolume;
          this.weight = item.weight;
          this.fillPeople = item.fillPeople;
          this.shipownerPeople = item.shipownerPeople;
          this.unberthingTime = item.unberthingTime;
          this.berthingTugboatNum = item.berthingTugboatNum;
          this.berthingTugboatName = item.berthingTugboatName;
          this.importEscortStartTime = item.importEscortStartTime;
          this.importEscortEndTime = item.importEscortEndTime;
          this.custodyTugboatNum = item.custodyTugboatNum;
          this.custodyTugboatName = item.custodyTugboatName;
          this.custodyStartTime = item.custodyStartTime;
          this.custodyEndTime = item.custodyEndTime;
          this.unberthingTugboatNum = item.unberthingTugboatNum;
          this.unberthingTugboatName = item.unberthingTugboatName;
          this.exportEscortStartTime = item.exportEscortStartTime;
          this.exportEscortEndTime = item.exportEscortEndTime;
          this.firstCable = item.firstCable;
          this.berthingTimeNum = item.berthingTimeNum;
          this.startTakingOver = item.startTakingOver;
          this.airtightCompletion = item.airtightCompletion;
          this.takingOverTimeNum = item.takingOverTimeNum;
          this.startCoolingTube = item.startCoolingTube;
          this.coolingTubeCompletion = item.coolingTubeCompletion;
          this.coolingTubeTimeNum = item.coolingTubeTimeNum;
          this.stopPump = item.stopPump;
          this.removeTubeCompletion = item.removeTubeCompletion;
          this.includeFlag = item.includeFlag;
          this.removeTubeTimeNum = item.removeTubeTimeNum;
          this.homeworkDurationTimeNum = item.homeworkDurationTimeNum;
          this.importEscortTimeNum = item.importEscortTimeNum;
          this.custodyTimeNum = item.custodyTimeNum;
          this.exportEscortTimeNum = item.exportEscortTimeNum;
          this.includeFlag = item.includeFlag;
          this.state = item.state;
          this.reliableTime = item.reliableTime;
          this.reliable = item.reliable;
          this.id = a;
          this.textarea2 = item.deleteMessage;
          if (item.notPassMessage) {
            this.notPassMessage = item.notPassMessage;
          }
          this.compare = JSON.stringify({
            homeworkMonth: item.homeworkMonth,
            preStartDate: item.preStartDate,
            homeworkNum: item.homeworkNum,
            preEndDate: item.preEndDate,
            homeworkLocation: item.homeworkLocation,
            loadedShip: item.loadedShip,
            filledShip: item.filledShip,
            preWorkload: item.preWorkload,
            fillingAmountHeatValue: item.fillingAmountHeatValue,
            fillingAmountVolume: item.fillingAmountVolume,
            weight: item.weight,
            fillPeople: item.fillPeople,
            shipownerPeople: item.shipownerPeople,
            unberthingTime: item.unberthingTime,
            berthingTugboatNum: item.berthingTugboatNum,
            berthingTugboatName: item.berthingTugboatName,
            importEscortStartTime: item.importEscortStartTime,
            importEscortEndTime: item.importEscortEndTime,
            custodyTugboatNum: item.custodyTugboatNum,
            custodyTugboatName: item.custodyTugboatName,
            custodyStartTime: item.custodyStartTime,
            custodyEndTime: item.custodyEndTime,
            unberthingTugboatNum: item.unberthingTugboatNum,
            unberthingTugboatName: item.unberthingTugboatName,
            exportEscortStartTime: item.exportEscortStartTime,
            exportEscortEndTime: item.exportEscortEndTime,
            firstCable: item.firstCable,
            berthingTimeNum: item.berthingTimeNum,
            startTakingOver: item.startTakingOver,
            airtightCompletion: item.airtightCompletion,
            takingOverTimeNum: item.takingOverTimeNum,
            startCoolingTube: item.startCoolingTube,
            coolingTubeCompletion: item.coolingTubeCompletion,
            coolingTubeTimeNum: item.coolingTubeTimeNum,
            stopPump: item.stopPump,
            removeTubeCompletion: item.removeTubeCompletion,
            includeFlag: item.includeFlag,
            removeTubeTimeNum: item.removeTubeTimeNum,
            homeworkDurationTimeNum: item.homeworkDurationTimeNum,
            importEscortTimeNum: item.importEscortTimeNum,
            custodyTimeNum: item.custodyTimeNum,
            exportEscortTimeNum: item.exportEscortTimeNum,
            includeFlag: item.includeFlag,
            state: item.state,
            reliableTime: item.reliableTime,
            reliable: item.reliable,
          });
        }
      });
      this.show = "block";
      if (this.roleId == 2 && this.state == "B") {
        this.disabledA = true;
        this.disabledB = true;
        this.disabled1 = false;
      } else if (this.roleId == 2 && !this.state) {
        this.disabledA = false;
        this.disabledB = true;
        this.disabled1 = true;
      } else if (this.roleId == 3 && this.state == "A1") {
        this.disabledA = true;
        this.disabledB = false;
        this.disabled1 = true;
      } else {
        this.disabledA = true;
        this.disabledB = true;
        this.disabled1 = true;
      }
      if (this.state == "C") {
        this.radio1 = "1";
      }
    },

    // 删除数据
    deleteOne(a) {
      // let that = this;
      this.$alert("确定删除这条信息？", {
        confirmButtonText: "确定",
        callback: (action) => {
          if (action == "confirm") {
            service({
              method: "delete",
              url: `/add-homework/${a}`,
            })
              .then((r) => {
                if (r.status == "SUCCESS") {
                  this.$message({
                    type: "success",
                    message: "删除成功",
                  });
                  if (this.currentNum == 1 && this.page > 1) {
                    this.page--;
                  }
                  this.getRenderList();
                  this.show = "none";
                }
              })
              .catch((err) => {
                this.$message({
                  type: "danger",
                  message: "出错了！",
                });
              });
          } else {
            this.$message({
              type: "info",
              message: "取消删除",
            });
          }
        },
      });
    },

    formatText(row) {
      if (row.coldCabinFlag == true) {
        return "是";
      } else if (row.coldCabinFlag == false) {
        return "否";
      } else {
        return "";
      }
    },
    // 弹窗确认按钮
    sureAdd() {
      if (this.roleId == 2) {
        let data = {};
        if (this.addOrEdit == "新增") {
          // 这里只有2可以新增

          data = {
            homeworkMonth: this.homeworkMonth,
            preStartDate: this.preStartDate,
            homeworkNum: this.homeworkNum,
            preEndDate: this.preEndDate,
            homeworkLocation: this.homeworkLocation,
            loadedShip: this.loadedShip,
            filledShip: this.filledShip,
            preWorkload: this.preWorkload,
            coldCabinFlag: this.coldCabinFlag,
            type: 2,
          };
          service({
            method: "post",
            data: data,
            url: "/add-homework",
          })
            .then((r) => {
              if (r.status == "SUCCESS") {
                this.$message({
                  type: "success",
                  message: "新增成功",
                });
                this.clearCanShu();
                this.getRenderList();
                this.show = "none";
              }
            })
            .catch((err) => {
              this.$message({
                type: "info",
                message: "出错了！",
              });
            });
        } else if (this.addOrEdit == "编辑" && this.state == "B") {
          data = {
            includeFlag: this.includeFlag,
            id: this.id,
            type: 2,
          };
          service({
            method: "put",
            data: data,
            url: "/add-homework",
          })
            .then((r) => {
              if (r.status == "SUCCESS") {
                this.$message({
                  type: "success",
                  message: "提交成功",
                });
                this.clearCanShu();
                this.getRenderList();
                this.show = "none";
              }
            })
            .catch((err) => {
              this.$message({
                type: "info",
                message: "出错了！",
              });
            });
        } else if (!this.state) {
          data = {
            id: this.id,
            homeworkMonth: this.homeworkMonth,
            preStartDate: this.preStartDate,
            homeworkNum: this.homeworkNum,
            preEndDate: this.preEndDate,
            homeworkLocation: this.homeworkLocation,
            loadedShip: this.loadedShip,
            filledShip: this.filledShip,
            preWorkload: this.preWorkload,
            coldCabinFlag: this.coldCabinFlag,
            type: 2,
          };
          service({
            method: "put",
            data: data,
            url: "/add-homework",
          })
            .then((r) => {
              if (r.status == "SUCCESS") {
                this.$message({
                  type: "success",
                  message: "提交成功",
                });
                this.clearCanShu();
                this.getRenderList();
                this.show = "none";
              }
            })
            .catch((err) => {
              this.$message({
                type: "info",
                message: "出错了！",
              });
            });
        }
      } else if (this.roleId == 3) {
        let data = {
          fillingAmountHeatValue: this.fillingAmountHeatValue,
          fillingAmountVolume: this.fillingAmountVolume,
          weight: this.weight,
          fillPeople: this.fillPeople,
          shipownerPeople: this.shipownerPeople,
          reliableTime: this.reliableTime
            ? this.forMateDateTime(this.reliableTime)
            : "",
          unberthingTime: this.unberthingTime
            ? this.forMateDateTime(this.unberthingTime)
            : "",
          berthingTugboatNum: this.berthingTugboatNum,
          berthingTugboatName: this.berthingTugboatName,
          importEscortStartTime: this.importEscortStartTime
            ? this.forMateDateTime(this.importEscortStartTime)
            : "",
          importEscortEndTime: this.importEscortEndTime
            ? this.forMateDateTime(this.importEscortEndTime)
            : "",
          custodyTugboatNum: this.custodyTugboatNum,
          custodyTugboatName: this.custodyTugboatName,
          custodyStartTime: this.custodyStartTime
            ? this.forMateDateTime(this.custodyStartTime)
            : "",
          custodyEndTime: this.custodyEndTime
            ? this.forMateDateTime(this.custodyEndTime)
            : "",
          unberthingTugboatNum: this.unberthingTugboatNum,
          unberthingTugboatName: this.unberthingTugboatName,
          exportEscortStartTime: this.exportEscortStartTime
            ? this.forMateDateTime(this.exportEscortStartTime)
            : "",
          exportEscortEndTime: this.exportEscortEndTime
            ? this.forMateDateTime(this.exportEscortEndTime)
            : "",
          firstCable: this.firstCable
            ? this.forMateDateTime(this.firstCable)
            : "",
          reliable: this.reliable ? this.forMateDateTime(this.reliable) : "",
          startTakingOver: this.startTakingOver
            ? this.forMateDateTime(this.startTakingOver)
            : "",
          airtightCompletion: this.airtightCompletion
            ? this.forMateDateTime(this.airtightCompletion)
            : "",
          startCoolingTube: this.startCoolingTube
            ? this.forMateDateTime(this.startCoolingTube)
            : "",
          coolingTubeCompletion: this.coolingTubeCompletion
            ? this.forMateDateTime(this.coolingTubeCompletion)
            : "",
          stopPump: this.stopPump ? this.forMateDateTime(this.stopPump) : "",
          removeTubeCompletion: this.removeTubeCompletion
            ? this.forMateDateTime(this.removeTubeCompletion)
            : "",
          reliable: this.reliable ? this.forMateDateTime(this.reliable) : "",
          berthingTimeNum: this.berthingTimeNum,
          takingOverTimeNum: this.takingOverTimeNum,
          coolingTubeTimeNum: this.coolingTubeTimeNum,
          removeTubeTimeNum: this.removeTubeTimeNum,
          homeworkDurationTimeNum: this.homeworkDurationTimeNum,
          importEscortTimeNum: this.importEscortTimeNum,
          custodyTimeNum: this.custodyTimeNum,
          exportEscortTimeNum: this.exportEscortTimeNum,
          type: 2,
          id: this.id,
        };
        service({
          method: "put",
          data: data,
          url: "/add-homework",
        })
          .then((r) => {
            if (r.status == "SUCCESS") {
              this.$message({
                type: "success",
                message: "提交成功",
              });
              this.clearCanShu();
              this.getRenderList();
              this.show = "none";
            }
          })
          .catch((err) => {
            this.$message({
              type: "info",
              message: "出错了！",
            });
          });

        //这里处理管理员B填写界面
      } else if (
        this.addOrEdit == "编辑" &&
        (this.roleId == 1 || this.roleId == 4) &&
        (this.state == "A2" || this.state == "C")
      ) {
        let data;

        if (!this.radio1) {
          return this.$message({
            message: "请先选择审核结果再确认！",
            type: "warning",
          });
        }

        if (this.radio1 == 1) {
          data = {
            id: this.id,
            passFlag: true,
          };
        } else if (this.radio1 == 2) {
          if (!this.textarea1) {
            return this.$message({
              message: "退回原因不能为空",
              type: "warning",
            });
          }
          data = {
            id: this.id,
            passFlag: false,
            notPassMessage: this.textarea1,
          };
        }
        service({
          method: "put",
          data: data,
          url: "/add-homework",
        })
          .then((r) => {
            if (r.status == "SUCCESS") {
              this.$message({
                type: "success",
                message: "审核完成",
              });
              this.clearCanShu();
              this.getRenderList();
              this.radio1 = null;
              this.textarea1 = null;
              this.show = "none";
            }
          })
          .catch((err) => {
            this.$message({
              type: "info",
              message: "出错了！",
            });
          });
      } else if (
        (this.roleId == 1 || this.roleId == 4) &&
        this.addOrEdit == "删除审核"
      ) {
        let data;
        if (!this.radio2) {
          return this.$message({
            message: "请先选择审核结果",
            type: "warning",
          });
        }
        if (this.radio2 == 1) {
          data = {
            deleteFlag: true,
            id: this.id,
          };
        } else if (this.radio2 == 2) {
          data = {
            deleteFlag: false,
            id: this.id,
          };
        }
        service({
          method: "put",
          data: data,
          url: "/add-homework",
        })
          .then((r) => {
            if (r.status == "SUCCESS") {
              this.$message({
                type: "success",
                message: "审核完成",
              });
              this.clearCanShu();
              this.getRenderList();
              this.show = "none";
              this.radio2 = null;
            }
          })
          .catch((err) => {
            this.$message({
              type: "info",
              message: "出错了！",
            });
            this.radio2 = null;
          });
      }
    },

    // 关闭弹窗
    close() {
      this.show = "none";
      this.show1 = "none";
      this.notPassMessage = null;
      this.clearCanShu();
    },
    // 新增
    addOne() {
      this.clearCanShu();

      this.addOrEdit = "新增";
      this.show = "block";
      this.disabledA = false;
      this.disabledB = true;
      this.disabled1 = true;
    },
    // 导出文件
    getFileName() {
      let date = new Date();
      let year = date.getFullYear().toString();
      let month =
        date.getMonth() + 1 > 9
          ? date.getMonth() + 1
          : "0" + (date.getMonth() + 1);
      let day =
        date.getDate() > 10 ? date.getDate().toString() : "0" + date.getDate();
      let hour =
        date.getHours() > 10
          ? date.getHours().toString()
          : "0" + date.getHours();
      let min =
        date.getMinutes() > 10
          ? date.getMinutes().toString()
          : "0" + date.getMinutes();
      date = null;
      return `${year}${month}${day}${hour}${min}`;
    },

    // 导出文件
    getFileName() {
      let date = new Date();
      let year = date.getFullYear().toString();
      let month =
        date.getMonth() + 1 > 9
          ? date.getMonth() + 1
          : "0" + (date.getMonth() + 1);
      let day =
        date.getDate() > 10 ? date.getDate().toString() : "0" + date.getDate();
      let hour =
        date.getHours() > 10
          ? date.getHours().toString()
          : "0" + date.getHours();
      let min =
        date.getMinutes() > 10
          ? date.getMinutes().toString()
          : "0" + date.getMinutes();
      date = null;
      return `${year}${month}${day}${hour}${min}`;
    },

    sendMessage() {
      let res = rename();
      EventBus.emit("custom-event", res);
    },
    // 点击查询所有删除数据

    // 获取列表数据
    async getRenderList() {
      let data = {};

      data = {
        page: this.page,
        size: this.size,
        deleteByUser: this.deleteByUser,
        type: 2,
      };

      await service({
        methods: "get",
        url: "/add-homework/find-one-page",
        params: data,
      })
        .then((e) => {
          this.totalPages = e.data.totalPages;
          this.totalNumber = e.data.totalElements;
          if (this.totalPages == 0) {
            this.totalPages = 1;
          }
          if (this.page < this.totalPages) {
            this.color1 = "#268FDE";
          } else {
            this.color1 = "#EBEBEB";
          }
          if (this.page == 1) {
            this.color = "#EBEBEB";
          } else {
            this.color = "#268FDE";
          }
          this.tableData = e.data.content;
          this.currentNum = e.data.numberOfElements;
          this.getDeleteNumber();
        })
        .catch((err) => {});
    },
    // 获取批量删除数据
    async getDeleteNumber() {
      await service({
        methods: "get",
        url: "/add-homework/get-delete-count",
        params: { type: 2 },
      })
        .then((e) => {
          this.deleteNumber = e.data;
        })
        .catch((err) => {});
    },
    clearCanShu() {
      this.state = "";
      this.homeworkMonth = "";
      this.preStartDate = "";
      this.homeworkNum = "";
      this.preEndDate = "";
      this.homeworkLocation = "";
      this.reliable = "";
      this.loadedShip = "";
      this.filledShip = "";
      this.preWorkload = "";
      this.reliableTime = "";
      this.fillingAmountHeatValue = "";
      this.fillingAmountVolume = "";
      this.weight = "";
      this.fillPeople = "";
      this.shipownerPeople = "";

      this.unberthingTime = "";
      this.berthingTugboatNum = "";
      this.berthingTugboatName = "";
      this.importEscortStartTime = "";
      this.importEscortEndTime = "";
      this.custodyTugboatNum = "";
      this.custodyTugboatName = "";
      this.custodyStartTime = "";
      this.custodyEndTime = "";
      this.unberthingTugboatNum = "";
      this.unberthingTugboatName = "";
      this.exportEscortStartTime = "";
      this.exportEscortEndTime = "";
      this.firstCable = "";

      this.berthingTimeNum = "";
      this.startTakingOver = "";
      this.airtightCompletion = "";
      this.takingOverTimeNum = "";
      this.startCoolingTube = "";
      this.coolingTubeCompletion = "";
      this.coolingTubeTimeNum = "";
      this.stopPump = "";
      this.removeTubeCompletion = "";
      this.includeFlag = "";
      this.removeTubeTimeNum = "";
      this.homeworkDurationTimeNum = "";
      this.importEscortTimeNum = "";
      this.custodyTimeNum = "";
      this.exportEscortTimeNum = "";
      this.data = {
        homeworkMonth: "",
        preStartDate: "",
        homeworkNum: "",
        preEndDate: "",
        homeworkLocation: "",
        reliable: "",
        loadedShip: "",
        filledShip: "",
        preWorkload: "",
        fillingAmountHeatValue: "",
        fillingAmountVolume: "",
        weight: "",
        fillPeople: "",
        shipownerPeople: "",
        preWorkload: "",
        reliableTime: "",
        unberthingTime: "",
        berthingTugboatNum: "",
        berthingTugboatName: "",
        importEscortStartTime: "",
        importEscortEndTime: "",
        custodyTugboatNum: "",
        custodyTugboatName: "",
        custodyStartTime: "",
        custodyEndTime: "",
        unberthingTugboatNum: "",
        unberthingTugboatName: "",
        exportEscortStartTime: "",
        exportEscortEndTime: "",
        firstCable: "",
        berthing: "",
        berthingTimeNum: "",
        startTakingOver: "",
        airtightCompletion: "",
        takingOverTimeNum: "",
        startCoolingTube: "",
        coolingTubeCompletion: "",
        coolingTubeTimeNum: "",
        stopPump: "",
        removeTubeCompletion: "",
        includeFlag: "",
        removeTubeTimeNum: "",
        homeworkDurationTimeNum: "",
        importEscortTimeNum: "",
        custodyTimeNum: "",
        exportEscortTimeNum: "",
        includeFlag: "",
        id: "",
      };
    },

    clickLastPage() {
      if (this.page > 1) {
        this.page--;
        if (this.page == 1) {
          this.color = "#EBEBEB";
        } else {
          this.color = "#268FDE";
        }
        if (this.page < this.totalPages) {
          this.color1 = "#268FDE";
        }
        this.getRenderList();
      } else {
        this.color = "#EBEBEB";
      }
    },
    clickNextPage() {
      if (this.page < this.totalPages) {
        this.page++;
        this.color = "#268FDE";
        if (this.page == this.totalPages) {
          this.color1 = "#EBEBEB";
        } else {
          this.color1 = "#268FDE";
        }
      }
      this.getRenderList();
    },
    handSize() {
      if (window.innerWidth > 630) {
        if (this.$store.state.width == 200) {
          this.tableWidth = (window.innerWidth - 170) * 0.985 - 20 + "px";
        } else if (this.$store.state.width == 90) {
          this.tableWidth = (window.innerWidth - 60) * 0.985 - 20 + "px";
        }
      } else {
        this.tableWidth = window.innerWidth - 30 + "px";
      }
    },
    forMateDateTime(a) {
      let date = new Date(a);
      let year = date.getFullYear();
      let month =
        date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1;

      let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      let hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
      let min =
        date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();

      return `${year}/${month}/${day} ${hour}:${min}`;
    },
  },
  watch: {
    "$store.state.width"(newVal, oldVal) {
      //对数据执行操作
      if (window.innerWidth > 630) {
        if (newVal == 90) {
          this.tableWidth = (window.innerWidth - 60) * 0.985 - 20 + "px";
        } else if (newVal == 200) {
          this.tableWidth = (window.innerWidth - 170) * 0.985 - 20 + "px";
        }
      }
    },
    $route(to, from) {
      // 在这里根据参数的变化执行刷新页面的逻辑
      if (to.name == from.name) {
        this.close();
      }
    },
  },

  created() {
    this.findAllType();
    this.sendMessage();
    this.getRenderList();

    this.roleId = sessionStorage.getItem("role");
  },
  beforeMount() {
    if (window.innerWidth > 630) {
      if (this.$store.state.width == 200) {
        this.tableWidth = (window.innerWidth - 170) * 0.985 - 20 + "px";
      } else if (this.$store.state.width == 90) {
        this.tableWidth = (window.innerWidth - 60) * 0.985 - 20 + "px";
      }
    } else {
      this.tableWidth = window.innerWidth - 30 + "px";
    }
  },
  mounted() {
    window.addEventListener("resize", this.handSize);
  },
  beforeUnmount() {
    window.removeEventListener("resize", this.handSize);
  },
};
</script>
<style lang="less" scoped>
.manyInput::-webkit-scrollbar {
  width: 5px; /* 自定义滚动条的宽度 */
  height: 5px; /* 如果需要自定义垂直滚动条的高度 */
}

/* 自定义滚动条滑块的颜色 */
.manyInput::-webkit-scrollbar-thumb {
  background-color: #f1f1f1;
  border-radius: 10px; /* 可选：为滚动条滑块添加圆角 */
}

/* 自定义滚动条轨道的颜色 */
.manyInput::-webkit-scrollbar-track {
  background-color: white;
  border-radius: 10px; /* 可选：为滚动条轨道添加圆角 */
}

.manyInput {
  width: 95%;
  height: 80vh;
  margin: auto;
  overflow-y: auto;
  overflow-x: scroll;
  scrollbar-gutter: stable;

  .iuptInnerContain1 {
    width: 1460px;
    display: flex;
    margin: auto;
    flex-wrap: wrap;
    overflow-x: hidden;
    .inputInner {
      max-width: 375px;
      min-height: 35px;
      margin-right: 10px;
      margin-top: 10px;
      display: flex;
      align-items: center;
      color: #365488;
      .name {
        width: 125px;
        height: 100%;
        line-height: 4vh;
        text-align: right;
        font-size: 15px;
      }

      .inputContainer {
        width: 210px;
        margin-left: 5px;
      }
      .el-input__inner {
        // background: white !important;
      }
      input {
        width: 220px;
        height: 34px;
        margin-left: 5px;
        border-radius: 5px;
        text-indent: 1em;
        outline: none;
        border: none;
        // background: white !important;
        color: #365488;
        border: 1px solid #dcdfe6;
      }
      input::-webkit-input-placeholder {
        color: #a8abb2;
      }
      input[type="date"] {
        color: #365488;
        text-align: left;
        border-radius: 4px;
        box-sizing: border-box;
      }
    }
    .el-date-picker .el-picker-panel {
      background-color: white !important; /* 你想要的背景颜色 */
    }
  }
}
.iuptInnerContain {
  width: 100%;
  .inputInner {
    width: 375px;
    display: flex;
    align-items: center;
  }
}
.dialogText {
  margin: auto;
  width: 50%;
  line-height: 4vh;
  font-size: 25px;
  color: black;
  // text-indent: 10px;
  text-align: center;
  // font-size: 20px;
  font-weight: 800;
}

.dialog,
.dialog1 {
  width: 100%;
  height: 100%;
  background: #dfe6e8;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  z-index: 100;
}

.loadHomeWork {
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: relative;
  .loadHomeWorkIneer {
    width: 98.5%;
    height: 91vh;
    margin: auto;
    margin-top: 1vh;
    background: white;

    .loadAndSearch {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
    }
  }
}
.table {
  width: 98.5%;
  margin: auto;
  // margin-top: 2vh;
  height: 65vh;
  // background: red;
}

@media (min-width: 0px) and (max-width: 960px) {
  .manyInput {
    width: 375px !important;
    display: block !important;
    .inputInner {
      margin: auto !important;
      margin-top: 10px !important;
    }
  }
}
</style>
